<template>
	<!-- 辅助对象查看全部列表 -->
	<view class="content">

		<!-- 对象列表 -->
		<view class="list_box" v-for="item in targetsList">
			<!-- 头部删除 -->
			<view class="list_box_head">
				<view></view>
				<view>
					<view class="del_box" @click="delSub(item)">
						删除 X<van-icon name="cross" />
					</view>
				</view>
			</view>
			<!-- 头像 信息 -->
			<view class="list_body">
				<image :src="'https://educationafter.jinghaischool.com'+item.tx"></image>
				<view class="list_body_font">
					<view>
						<text class="full-name">{{item.counsellingName}}</text>
						<text>{{item.counsellingSex == 0 ? '男' : '女'}}</text>
						<text class="vertical-line">|</text>
						<text>{{item.age}}岁</text>
					</view>
					<text class="time">{{item.counsellingBirth}} 出生</text>
					<text class="time"
						v-if="item.subjectsDtos.length != 0">{{item.subjectsDtos[0].name}}{{item.subjectsDtos[0].subjectsDtos}}</text>
					<text class="time" v-else>暂无</text>
				</view>
			</view>
			<!-- 操作按钮 -->
			<view class="button">
				<view @click="sendDetail(item)" class="button-details">
					详情</view>
				<view @click="sendEditSub(item)" class="button-edit">
					编辑</view>
			</view>
		</view>
		<view class="" v-if="targetsList.length == 0">
			<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" width="750rpx" height="750rpx">
			</u-empty>
		</view>
		<view class="floor">
		</view>
		<view class="floor-box">
			<button @click="addTargets" class="floor-text">添加辅导对象</button>
		</view>
	</view>
</template>

<script>
	import {
		coachingTargets,
		targetsId
	} from '../../api/my/index.js'
	export default {
		data() {
			return {
				// 列表信息
				targetsList: []
			}
		},
		mounted() {

		},
		onShow() {
			this.listTargets()
		},
		methods: {
			// 接口请求数据
			listTargets() {
				coachingTargets({
					userId: uni.getStorageSync('openId'),
				}).then(res => {
					console.log(res);
					this.targetsList = res.rows
					// this.targetsList = res.data.rows
				})
			},
			// 详情
			sendDetail(info) {
				uni.navigateTo({
					url: `/pages/basicInformation/basicInformation?targetsName=${info.counsellingName}`
				})
			},
			// 编辑
			sendEditSub(info) {
				uni.navigateTo({
					url: '/pages/addCounsellObj/addCounsellObj?id=' + info.id
				})
			},
			// 添加按钮
			addTargets() {
				console.log('添加辅导对象')
				uni.navigateTo({
					url: '/pages/addCounsellObj/addCounsellObj?'
				})
			},
			// 删除按钮
			delSub(val) {
				let _this = this
				uni.showModal({
					content: '确认要删除么?',
					success(e) {
						if (e.confirm) {
							console.log('确认删除', )
							targetsId({
								idi: val.id,
							}).then(res => {

								_this.listTargets()
								if (res.code == 200) {
									setTimeout(() => {

										uni.showToast({
											title: "删除成功",
											icon: 'none'
										})

									}, 500)

								}
							})
						}
					}
				})

			}
		},
	}
</script>

<style scoped>
	image {
		width: 120rpx;
		height: 120rpx;
		border-radius: 200rpx;

	}

	.content {
		padding: 25rpx 0;
		background-color: cadetblue;
		min-height: 100vh;
		background-color: #f7f7f7;
	}

	.list_box {
		margin-bottom: 25rpx;
		background-color: #fff;
	}

	.list_box_head {
		display: flex;
		justify-content: space-between;
		box-sizing: border-box;
		padding: 20rpx 25rpx;
	}

	.del_box {
		padding: 5rpx 15rpx;
		border: 2rpx solid #999999;
		color: #999999;
		border-radius: 50rpx;
	}


	.list_body {
		display: flex;
		padding: 0 35rpx;
	}

	.list_body_font {
		display: flex;
		flex-direction: column;
		margin-left: 35rpx;
		font-size: 25rpx;
	}

	.full-name {
		font-weight: 600;
		font-size: 28rpx;
		margin-right: 20rpx;
	}

	.vertical-line {
		margin: 0 10rpx;
	}

	.time {
		margin-top: 25rpx;
	}

	.speciality {
		margin-top: 25rpx;
	}

	.button {
		display: flex;
		width: 100%;
		border-top: 2rpx solid #d7d7d7;
		margin-top: 30rpx;
		background-color: #ffffff;
		padding: 15rpx 0;
	}

	.button-details {
		width: 50%;
		background-color: #ffffff;
		color: #14c025;
		text-align: center;
		line-height: 60rpx;
		border-right: 2rpx solid #dfdfdf;
	}

	.button-edit {
		width: 50%;
		background-color: #ffffff;
		color: #14c025;
		text-align: center;
		line-height: 60rpx;
	}

	.floor {
		height: 150rpx;
		width: 100%;
	}

	.floor-box {
		background-color: #f7f7f7;
		width: 100%;
		height: 180rpx;
		box-sizing: border-box;
		padding: 0 50rpx;
		position: fixed;
		bottom: 0rpx;
	}

	.floor-text {
		background-color: #04bc16;
		color: #fff;
	}
</style>